import vueX from "vuex";
import Vue from "vue";
import service from "@/utils/service"
import moduleA from "./moduleA";
import moduleB from "./moduleB";

// 把vuex安装到vue里
Vue.use(vueX);

export default new vueX.Store({
    // 给该仓库定义模块，每个模块相当于一个小的仓库。
    modules:{
        a:moduleA,
        moduleB
    },
    //根仓库的数据
    state:{
        age:16,
        isAdult:false,
        isAllowMarry:false,
        isLoading:false
    },
    // 就是在state的基础上进一步派生的数据
    getters:{
        // 参数：state不需要程序员传入
        isAdult(state){
            return state.isAdult?"已成年":"未成年"
        }
    },
    // mutation：是跟 跟踪状态有关 的
    mutations:{
        // 参数：
        // state不需要程序员传入，state对象就是仓库的数据
        // payload:载荷，其实就是函数的参数。
        mAddAge(state,payload){
            
            console.log("payload",payload);
            if(state.age+1>150){
                return;
            }                        
            state.age+=payload.inc;

            if(state.age>=18){
                state.isAdult = true;
            }else{
                state.isAdult = false;
            }   

        },
        showLoading(state){
            state.isLoading = true;
        },
        hideLoading(state){
            state.isLoading = false;
        }
    },
    actions:{
        // 参数：
        // context 不需要程序员传入，context就是store对象。
        aAddAge(context){
            service({
                url:"http://localhost:3000/inc"
            })
            .then(res=>{
                // 提交mutation。
                console.log("提交前：",context.state.age);
                context.commit({
                    type:"mAddAge",
                    inc:res.data.count
                })
                console.log("提交后：",context.state.age);
            })
        }
    }
})

